<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title> 宠物 </title>
    <link rel="stylesheet" href="//at.alicdn.com/t/font_1494155_otnhem4cq2n.css"/>
    <link rel="stylesheet" href="../css/flex.css"/>
    <link rel="stylesheet" href="../css/cw.css"/>
</head>
<body>


<!--头部-->
<header>
    <div class="a-1" flex="main:center cross:center">
        <div class="a--1 " flex="main:justify ">
            <div flex>
                <i class="iconfont icon-yinliang1"></i>

                <p class="p-1">热烈庆祝官网改版郑重来袭！</p>
            </div>
            <div flex class="a--2">
                <a href="#">设为首页</a>
                <a href="#" class="p-2">加入收藏</a>
                <a href="#">联系我们</a>

            </div>
        </div>
    </div>
    <div flex="main:center">
        <div class="a--3" flex="cross:center">
            <div><!--flex="cross:center"-->
                <input type="text"/>
                <button>
                    <i class="iconfont icon-fangdajing"></i>
                </button>
            </div>
            <div class="a-2" flex>
                <div flex="cross:center">
                    <i class="iconfont icon-weibiaoti1"></i>
                    <span>000-12345678</span>
                </div>
                <div flex="cross:center" class="a-3">
                    <i class="iconfont icon-duanxin"></i>
                    <span>12345678@qq.com</span>
                </div>
            </div>
            <div class="a-4">
                <i class="iconfont icon-qq-copy"></i>
                <i class="iconfont icon-weixin-copy"></i>
                <i class="iconfont icon-weibo"></i>
            </div>

        </div>

    </div>


</header>


<!--banner-->
<section id="a" flex="main:center">
    <!-- <img src="../img/banner1.jpg" >-->
    <div class="wlx" flex="dir:top cross:center">
        <div class="a-5" flex="main:center cross:center">
            <p>We will always be your most sincere partner</p>
        </div>
        <p class="p-3">我们永远是您最真诚的伙伴</p>
        <button class="bu-1">查看更多</button>
    </div>


</section>

<!--楼2-->
<section>
    <div class="div-1" flex="main:center">
        <div class="wlx" flex="dir:top cross:center">
            <div class="div--1">
                <img src="../img/1.png">
            </div>
            <ul flex class="ul-1">
                <li>
                    <div class="div--2" flex="cross:center">
                        <div></div>
                        <p class="p-4">顺义中心</p>
                    </div>
                    <img src="../img/a1.jpg">
                    <span class="sp-1">敞明亮:宽敞明亮的生活环境使宠物可以有好的休息和活动的生活环境，休息区和活动区要分开。</span>
                    <button class="bu-2">查看详情</button>
                </li>
                <li>
                    <div class="div--2" flex="cross:center">
                        <div></div>
                        <p class="p-4">房山中心</p>
                    </div>
                    <img src="../img/a2.jpg">
                    <span class="sp-1">足够发寄养房间:要根据宠物的年龄，大小，性别，脾气秉性等特点来安排不同的生活房间，每个房间小型狗不应超过六只，大型狗不应超过三只。</span>
                    <button class="bu-2">查看详情</button>
                </li>
                <li>
                    <div class="div--2" flex="cross:center">
                        <div></div>
                        <p class="p-4">训练中心</p>
                    </div>
                    <img src="../img/a3.jpg">
                    <span class="sp-1">完整的训练体系，给您的宠物一个安心舒适的环境。在这里，您的宠物将经历两个月的训练课程，每一天都会有不一样的精彩。</span>
                    <button class="bu-2">查看详情</button>
                </li>
            </ul>
        </div>
    </div>
</section>

<!--楼3-->
<section class="div-1" flex="dir:top cross:center">

    <div class="div--1">
        <img src="../img/1.png">
    </div>

    <ul flex="main:justify" class="wlx ul-2">
        <li>
            <img src="../img/a1.jpg">

            <p class="p-5">国内托运</p>

            <div class="div-2"></div>
            <span class="sp-2">敞明亮:宽敞明亮的生活环境使宠物可以有好的休息和活动的生活环境，休息区和活动区要分开。</span>
            <button class="bu-2">查看详情</button>
        </li>
        <li>
            <img src="../img/a1.jpg">

            <p class="p-5">国内托运</p>

            <div class="div-2"></div>
            <span class="sp-2">敞明亮:宽敞明亮的生活环境使宠物可以有好的休息和活动的生活环境，休息区和活动区要分开。</span>
            <button class="bu-2">查看详情</button>
        </li>
        <li>
            <img src="../img/a1.jpg">

            <p class="p-5">国内托运</p>

            <div class="div-2"></div>
            <span class="sp-2">敞明亮:宽敞明亮的生活环境使宠物可以有好的休息和活动的生活环境，休息区和活动区要分开。</span>
            <button class="bu-2">查看详情</button>
        </li>

    </ul>

</section>

<!--楼4-->
<section  flex="dir:top cross:center ">
    <img  class="img-1" src="../img/1.png">

    <div class="div-3">
        <button >德国牧羊犬</button>
        <button>日本柴犬</button>
        <button>拉布拉多</button>
        <button>边牧</button>
    </div>

    <div class="wlx div-4" flex="main:justify">
        <img src="../img/a6.jpg" >
        <img src="../img/a6.jpg" >
        <img src="../img/a6.jpg" >
        <img src="../img/a6.jpg" >
        <img src="../img/a6.jpg" >

    </div>


</section>
<!--楼5-->
<section id="b">

</section>


</body>
</html>


